<template>
  <div class="main">
    <p  class="main_text">公司审核</p>
    <div class="main_nav p20">
      <el-form :model="searchData" class="df">
        <el-form-item label="公司名称：" class="mr20" style="width: 20%">
          <el-input v-model="searchData.companyName" placeholder="公司名称" />
        </el-form-item>
        <el-form-item label="审核状态：" class="mr20" style="width: 20%">
          <el-select v-model="searchData.auditStatus" placeholder="审核状态">
            <el-option label="待审核" value="0" />
            <el-option label="未通过" value="1" />
            <el-option label="已通过" value="2" />
            <el-option label="待上传合同" value="3" />
            <el-option label="待提交" value="-1" />
          </el-select>
        </el-form-item>
        <el-form-item style="width: 20%">
          <div class="df">
            <el-button type="primary" @click="searchDataBtn">查询</el-button>
            <el-button type="primary" plain @click="resc">重置</el-button>
          </div>
        </el-form-item>
      </el-form>
    </div>
    <!-- #####################################底部##################################### -->
    <div class="cyr-flex mt20">
      <el-table @selection-change="handleSelectionChange" :data="tableData"
        :header-cell-style="{ background: '#f0f6fe' }"   border  v-adaptive :show-overflow-tooltip="true">
        <el-table-column type="selection" width="35" />
        <el-table-column label="公司编号" prop="idStr" />
        <el-table-column label="公司名称" prop="companyName" :show-overflow-tooltip="true">
          <template #default="props">
            <el-text tag="span" style="cursor: pointer" @click="check(props.row)">{{ props.row.companyName }}</el-text>
          </template>
        </el-table-column>
        <!-- <el-table-column label="试用等级">
          <template #default="props">
            <el-button v-if="props.row.levelName == '已签署合同'" link type="success">{{ props.row.levelName }}</el-button>
            <el-popover v-else placement="bottom" width="230" trigger="hover" @show="showPopover(props.row.levelName)">
              <template #reference>
                <el-button link type="info">{{
        props.row.levelName
      }}</el-button>
              </template>
              <div class="df jcsb">
                <div>{{ props.row.levelName }}</div>
                <div class="df aic">
                  <el-button link size="small" type="success" @click="trialHistoryBtn(props.row)">历史记录</el-button>
                  <div style="color: #67c23a; margin: 0 2px; font-size: 10px">
                    |
                  </div>
                  <el-button link size="small" type="success" @click="editHistoryBtn(props.row)">编辑</el-button>
                </div>
              </div>
              <div v-if="showPopoverFlag == true">
                <div style="color: #b2b2b2" class="mt10">
                  试用期限: {{ showPopoverData.trialDuration }}天
                </div>
                <div style="color: #b2b2b2" class="mt10">
                  配件&emsp;累计上架数<span style="color: #67c23a">{{ showPopoverData.fittingNumOnSale }}</span>/{{
        showPopoverData.fittingNumber
      }}件
                </div>
                <div style="color: #b2b2b2" class="mt10">
                  整车&emsp;累计上架数<span style="color: #67c23a">{{ showPopoverData.wholeCarNumOnSale }}</span>/{{
        showPopoverData.carNumber
      }}件
                </div>
              </div>
            </el-popover>
          </template>
        </el-table-column> -->
        <el-table-column label="公司性质">
          <template #default="props">
            <e-text v-if="props.row.type == 1">拖车公司</e-text>
            <e-text v-else-if="props.row.type == 0">拆解厂（全部）</e-text>
            <e-text v-else-if="props.row.type == 2">拆解厂（仅商城）</e-text>
          </template>
        </el-table-column>
        <el-table-column label="公司地址" prop="address" :show-overflow-tooltip="true" />
        <el-table-column label="法人姓名" prop="legalPersonName" :show-overflow-tooltip="true" />
        <el-table-column label="更新时间" prop="updatedAt" :show-overflow-tooltip="true" />
        <el-table-column label="状态">
          <template #default="props">
            <!-- 1=>正常 2=>注销 3=>黑名单 4=>未激活 -->
            <el-button v-if="props.row.status == 0" size="small" link type="info">未提交</el-button>
            <el-button v-else-if="props.row.status == 1" size="small" link type="success">正常</el-button>
            <el-button v-else-if="props.row.status == 2" size="small" link type="danger">停用</el-button>
            <el-button v-else-if="props.row.status == 3" size="small" link type="warning">黑名单</el-button>
            <el-button v-else size="small" link>未激活</el-button>
          </template>
        </el-table-column>
        <el-table-column label="审核状态">
          <template #default="props">
            <!-- 0、审核中1、未通过2、已通过-->
            <el-button v-if="props.row.auditStatus == 0" size="small" link type="primary">待审核</el-button>
            <el-button v-else-if="props.row.auditStatus == 1" size="small" link type="danger">未通过</el-button>
            <el-button v-else-if="props.row.auditStatus == 2" size="small" link type="success">已通过</el-button>
            <el-button v-else-if="props.row.auditStatus == 3" size="small" link type="warning">待上传合同</el-button>
            <el-button v-else-if="props.row.auditStatus == null" size="small" link type="info">待提交</el-button>
            <!-- <el-button v-else size="small" link type="danger">待审核</el-button> -->
          </template>
        </el-table-column>
        <el-table-column label="操作" fixed="right" width="140">
          <template #default="props">
            <el-button size="small" link type="primary" @click="check(props.row)">查看</el-button>
            <!-- <el-button size="small" link type="primary" @click="check(props.row)">设置公司权限</el-button> -->
            <el-button size="small" link type="primary" v-if="props.row.auditStatus != null"
              @click="SubmitReview(props.row)">审核</el-button>
            <el-button size="small" link type="success" v-if="props.row.status == 2" @click="startUseBtn(props.row)">启用
            </el-button>
            <!-- <el-button size="small" link type="danger" @click="del(props.row.id)">删除</el-button> -->
          </template>
        </el-table-column>
      </el-table>
      <!-- 分页器 -->
      <smartPager
        v-model:current-page="currentPage"
        v-model:page-size="pageSize"
        :total="total"
        @change="handleCurrentChange" />
      <!-- ################################################ 蒙层查看公司 ################################################-->
      <el-dialog v-model="centerDialogVisible" align-center @close="closeDiag" width="750px">
        <template #header>
          <div class="df aic">
            <el-icon style="color: #fff" size="20">
              <Edit />
            </el-icon>&nbsp;
            <p style="color: #fff">查看公司</p>
          </div>
        </template>
        <div class="df aic jcsb">
          <p>公司基本信息</p>
          <div>
            <el-button type="primary" link size="small" @click="mask">设置公司授权</el-button>
          </div>
        </div>
        <el-descriptions class="margintop" :column="2" border>
          <el-descriptions-item>
            <template #label>
              <div class="cell-item">公司名称</div>
            </template>
            <p>{{ newTableDate.companyName }}</p>
          </el-descriptions-item>
          <el-descriptions-item>
            <template #label>
              <div class="cell-item">联系电话</div>
            </template>
            <p>{{ newTableDate.phone }}</p>
          </el-descriptions-item>
          <el-descriptions-item>
            <template #label>
              <div class="cell-item">公司地址</div>
            </template>
            <p>{{ newTableDate.address }}</p>
          </el-descriptions-item>
          <el-descriptions-item>
            <template #label>
              <div class="cell-item">邮政编码</div>
            </template>
            <p>{{ newTableDate.addressCode }}</p>
          </el-descriptions-item>
          <el-descriptions-item>
            <template #label>
              <div class="cell-item">主要负责人</div>
            </template>
            <p>{{ newTableDate.principalName }}</p>
          </el-descriptions-item>
          <el-descriptions-item>
            <template #label>
              <div class="cell-item">负责人电话</div>
            </template>
            <p>{{ newTableDate.principalPhone }}</p>
          </el-descriptions-item>
          <el-descriptions-item>
            <template #label>
              <div class="cell-item">银行</div>
            </template>
            <p>{{ bankName }}</p>
          </el-descriptions-item>
          <el-descriptions-item>
            <template #label>
              <div class="cell-item">对公账户</div>
            </template>
            <p>{{ accountNumber }}</p>
          </el-descriptions-item>
          <el-descriptions-item>
            <template #label>
              <div class="cell-item">法人身份证</div>
            </template>
            <el-avatar v-for="item in legalPersonIdCardImg" :key="item.id" shape="square" :size="60" :src="item.url"
              @click="seeImg(item.url)" />
          </el-descriptions-item>
          <el-descriptions-item>
            <template #label>
              <div class="cell-item">法人姓名</div>
            </template>
            <p>{{ newTableDate.legalPersonName }}</p>
          </el-descriptions-item>
          <el-descriptions-item>
            <template #label>
              <div class="cell-item">营业执照</div>
            </template>
            <el-avatar v-for="item in businessLicenseImg" :key="item.id" shape="square" :size="60" :src="item.url"
              @click="seeImg(item.url)" />
          </el-descriptions-item>
          <el-descriptions-item>
            <template #label>
              <div class="cell-item">社会统一信用代码</div>
            </template>
            <p>{{ newTableDate.certification }}</p>
          </el-descriptions-item>
          <el-descriptions-item>
            <template #label>
              <div class="cell-item">营业执照期限</div>
            </template>
            <el-date-picker v-model="newTableDate.expirationDate" type="datetime" placeholder="请选择到期时间" disabled />
          </el-descriptions-item>
          <el-descriptions-item>
            <template #label>
              <div class="cell-item">资质证书</div>
            </template>
            <el-avatar v-for="item in certificationImg" :key="item.id" shape="square" :size="60" :src="item.url"
              @click="seeImg(item.url)" />
          </el-descriptions-item>
          <el-descriptions-item>
            <template #label>
              <div class="cell-item">公司照片</div>
            </template>
            <el-avatar v-for="item in companyImgsImg" :key="item.id" shape="square" :size="60" :src="item.url"
              @click="seeImg(item.url)" />
          </el-descriptions-item>
          <el-descriptions-item v-if="contractImg.length != 0">
            <template #label>
              <div class="cell-item">合同</div>
            </template>
            <el-avatar v-for="item in contractImg" :key="item.id" shape="square" :size="60" :src="item.url"
              @click="seeImg(item.url)" />
          </el-descriptions-item>
        </el-descriptions>
        <template #footer>
          <span class="dialog-footer">
            <el-button size="small" @click="centerDialogVisible = false">取消</el-button>
          </span>
        </template>
      </el-dialog>
      <!-- ################################################ 设置公司权限 ################################################-->
      <el-dialog v-model="PerCenterDialogVisible" align-center width="40%" @close="closePerCenterDialogVisible">
        <template #header>
          <div class="df aic">
            <el-icon style="color: #fff" size="20">
              <Edit />
            </el-icon>&nbsp;
            <p style="color: #fff">设置权限</p>
          </div>
        </template>
        <!-- ##############树状############## -->
        <el-scrollbar height="22.5rem">
          <div v-if="displayTreeFlag">
            <el-tree ref="treeRefCheck" :data="dataSource" show-checkbox default-expand-all node-key="id"
              :default-checked-keys="checkedKeys">
              <template #default="{ node, data }">
                <span class="custom-tree-node">
                  <span>{{ node.label }}</span>
                </span>
              </template>
            </el-tree>
          </div>
        </el-scrollbar>
        <template #footer>
          <span class="dialog-footer">
            <el-button @click="PerCenterDialogVisible = false">取消</el-button>
            <el-button type="primary" @click="savePermission">保存</el-button>
          </span>
        </template>
      </el-dialog>
      <!-- ****************************** 提交审核 ****************************** -->
      <el-dialog class="dialog" v-model="checkcenterDialogVisible" width="40%" align-center>
        <template #header>
          <div class="df aic">
            <el-icon style="color: #fff" size="20">
              <Edit />
            </el-icon>&nbsp;
            <p style="color: #fff">审核</p>
          </div>
        </template>
        <el-form :model="auditTableData" label-width="120" label-position="left" class="df fdc aic">
          <el-form-item label="公司名称：" style="width: 60%">
            <el-input v-model="auditTableData.companyName" disabled />
          </el-form-item>
          <el-form-item label="负责人姓名：" style="width: 60%">
            <el-input v-model="auditTableData.principalName" disabled />
          </el-form-item>
          <el-form-item label="拆解厂类型：" style="width: 60%">
            <el-select v-model="auditTableData.type" placeholder="审核状态" style="width: 100%">
              <el-option label="拆解厂（全部）" value="0" />
              <el-option label="拖车公司" value="1" />
              <el-option label="拆解厂（仅商城）" value="2" />
            </el-select>
          </el-form-item>
          <el-form-item label="审核状态：" style="width: 60%">
            <el-select v-model="auditTableData.auditStatus" placeholder="审核状态" style="width: 100%">
              <el-option label="未通过" value="1" />
              <el-option label="已通过" value="2" />
            </el-select>
          </el-form-item>
          <!-- <el-form-item label="审核描述：" style="width: 60%;">
                        <el-input v-model="auditTableData.auditDescription" type="textarea" placeholder="审核描述" />
                    </el-form-item> -->
          <el-form-item label="拒绝原因：" v-if="auditTableData.auditStatus == 1" style="width: 60%">
            <el-input v-model="auditTableData.rejectReason" type="textarea" placeholder="拒绝原因" />
          </el-form-item>
        </el-form>
        <template #footer>
          <el-button type="primary" plain @click="checkcenterDialogVisible = false">取消</el-button>
          <el-button type="primary" @click="submitAudit">&nbsp;提交&nbsp;</el-button>
        </template>
      </el-dialog>
      <!-- ################################################ 查看图片 ################################################-->
      <el-dialog v-model="prewivewImg" align-center width="70%">
        <div style="
            height: 70vh;
            width: 100%;
            background-color: #fff;
            overflow-y: scroll;
          ">
          <img style="width: 100%" :src="previewImgUrl" alt="" />
        </div>
      </el-dialog>
      <!-- ################################################ 审核记录 ################################################-->
      <el-dialog v-model="trialHistoryDialogVisible" align-center width="40%">
        <template #header>
          <div class="df aic">
            <el-icon style="color: #fff" size="20">
              <Edit />
            </el-icon>&nbsp;
            <p style="color: #fff">历史记录</p>
          </div>
        </template>
        <el-table :data="trialHistoryTableData" style="width: 100%" :header-cell-style="{ background: '#f0f6fe' }"
          max-height="450">
          <el-table-column label="序号" prop="id" width="120" />
          <el-table-column label="基础设置" prop="levelName" />
          <el-table-column label="开始时间" prop="beginAt" />
          <el-table-column label="结束时间" prop="endAt" />
        </el-table>
        <template #footer>
          <span class="dialog-footer">
            <el-button size="small" @click="trialHistoryDialogVisible = false">取消</el-button>
          </span>
        </template>
      </el-dialog>
      <!-- ################################################ 修改公司等级 ################################################-->
      <el-dialog v-model="editHistoryDialogVisible" align-center width="40%">
        <template #header>
          <div class="df aic">
            <el-icon style="color: #fff" size="20">
              <Edit />
            </el-icon>&nbsp;
            <p style="color: #fff">修改试用档次</p>
          </div>
        </template>
        <el-form :model="editHistoryTableData" label-width="120" label-position="left" class="df fdc aic">
          <el-form-item label="试用期限：" style="width: 60%">
            <el-date-picker v-model="editHistoryTableData.validity" type="date" :disabled-date="disableDate"
              :default-time="defaultTime(23, 59, 59)" value-format="YYYY-MM-DDTHH:mm:ss" />
          </el-form-item>
          <el-form-item label="试用档级：" style="width: 60%">
            <el-select v-model="editHistoryTableData.levelId" placeholder="试用档级" style="width: 100%">
              <el-option v-for="item in tryLevelList" :key="item.id" :label="item.name" :value="item.id" />
            </el-select>
          </el-form-item>
        </el-form>
        <template #footer>
          <span class="dialog-footer">
            <el-button size="small" @click="editHistoryDialogVisible = false">取消</el-button>
            <el-button size="small" type="primary" @click="editHistorySaveBtn">保存</el-button>
          </span>
        </template>
      </el-dialog>
    </div>
  </div>
</template>

<script setup lang="ts">
import { ElMessage } from "element-plus";
import { Edit } from "@element-plus/icons-vue";
import { formatTime } from "../../../filters/index";
import {
  RequestCompaniesGetlistlimit,
  RequestCompaniesSetCompanyFunctions,
  RequestCompaniesCompanyRestart,
  RequestCompaniesCompanyActivateAudit,
  RequestcompaniesId,
  RequestCompaniesGetfunction,
  RequestEmployeeGetfunctionTree,
  RequestCompaniesGetCompanyUnActivity,
  RequestTryLevelGetDetailByLevelName,
  RequestTryCompanyGetHistory,
  RequestTryLevelList,
  RequestTryCompanyResetTryCompanyValidity,
} from "../../../api/path/index.js";
import { ref } from "vue";
const centerDialogVisible = ref(false);
const checkcenterDialogVisible = ref(false);
const prewivewImg = ref(false);
const PerCenterDialogVisible = ref(false);
const bankName = ref<any>(""); //银行名
const accountNumber = ref<any>(""); //对公账户
const previewImgUrl = ref<any>("");
const dialogImageUrl = ref<any>("");
const multipleSelection = ref<any>([]);
/* **************************************** 查询 *****************************************/
const searchData = ref<any>({
  auditStatus: "",
  status: "",
  companyName: "",
});
const searchDataBtn = () => {
  getData();
};
const resc = () => {
  searchData.value.auditStatus = "";
  searchData.value.status = "";
  searchData.value.companyName = "";
  getData();
};
/* 设置公司权限 */
const formData = ref<any>({
  companyName: "", //公司名
  parentId: "",
  phone: "",
  account_type: "",
  legalPersonName: "",
  card: "", //联系电话
  status: "",
  address: "",
  briefIntroduction: "",
  principalPhone: "",
  principalName: "",
});
const seeImg = (e: any) => {
  prewivewImg.value = true;
  previewImgUrl.value = e;
};
let dataTree = ref<any>();
const handleSelectionChange = (val: any) => {
  multipleSelection.value = val;
};
let tableData = ref<any>([]);
const newTableDate = ref<any>("");
/* ******************** 查看公司信息 *********************/
const editPermission = ref<any>();
const check = (row: any) => {
  centerDialogVisible.value = true;
  if (row.card) {
    bankName.value = JSON.parse(row.card.value).bankName;
    accountNumber.value = JSON.parse(row.card.value).accountNumber;
  }
  newTableDate.value = row;
  console.log("newTableDate.value", newTableDate.value);
  editPermission.value = row;
  row.imgs.forEach((val: any) => {
    if (val.type == 1) {
      // 法人身份证图片
      legalPersonIdCardImg.value.push({
        url: val.url,
        id: val.id,
      });
    } else if (val.type == 2) {
      // 营业执照图片
      businessLicenseImg.value.push({
        url: val.url,
        id: val.id,
      });
    } else if (val.type == 3) {
      // 资质证书图片
      certificationImg.value.push({
        url: val.url,
        id: val.id,
      });
    } else if (val.type == 4) {
      // 公司图片
      companyImgsImg.value.push({
        url: val.url,
        id: val.id,
      });
    } else if (val.type == 5) {
      // 合同图片
      contractImg.value.push({
        url: val.url,
        id: val.id,
      });
    }
  });
};
/* 请求公司列表信息 */
const dataSource = ref<any>([]);
const total = ref<any>(10);
const currentPage = ref<any>(1);
const pageSize = ref<any>(10);
const handleSizeChange = (val: number) => {
  getData();
};
const handleCurrentChange = (val: number) => {
  getData();
};
const companyImgsImg = ref<any>([]); //公司照片图片
const businessLicenseImg = ref<any>([]); //营业执照图片
const certificationImg = ref<any>([]); //资质证书图片
const legalPersonIdCardImg = ref<any>([]); //法人身份证图片
const contractImg = ref<any>([]); //合同
const getFunctionEmployee = ref<any>(
  JSON.parse(localStorage.getItem("roleInfo")!)
);
const getData = () => {
  // let companyNode = JSON.parse(localStorage.getItem('roleInfo')!).company
  getFunctionEmployee.value.includeUni = 1;
  console.log("getFunctionEmployee", getFunctionEmployee.value);
  RequestCompaniesGetlistlimit({
    rows: pageSize.value,
    page: currentPage.value,
    auditStatus: searchData.value.auditStatus,
    status: searchData.value.status,
    companyName: searchData.value.companyName,
  }).then((res: any) => {
    // RequestCompaniesGetCompanyUnActivity({ rows: pageSize.value, page: currentPage.value }).then((res: any) => {
    console.log(res.resultObj);
    tableData.value = res.resultObj.data;
    total.value = res.resultObj.total;
    res.resultObj.data.forEach((item: any) => {
      // item.detailAddress = item.address.split('-')[1]
      // item.address = item.address.split(",")[0];
      item.updatedAt = formatTime(item.updatedAt);
      item.registAt = formatTime(item.registAt);
    });
  });
  RequestEmployeeGetfunctionTree(getFunctionEmployee.value).then((res: any) => {
    console.log("res.resultObj", res.resultObj[0].children);
    let treeData = JSON.stringify(res.resultObj[0].children)
      .replace(/name/g, "label")
      .replace(/{ title: '/g, "")
      .replace(/' }/g, "");
    dataSource.value = JSON.parse(treeData);
  });
  // let treeData = ref<any>(
  //   localStorage
  //     .getItem("roleRoutes")
  //     ?.replace(/name/g, "label")
  //     .replace(/{ title: '/g, "")
  //     .replace(/' }/g, "")
  // );
};
const closeDiag = () => {
  companyImgsImg.value = []; //公司照片图片  
  businessLicenseImg.value = []; //营业执照图片
  certificationImg.value = []; //资质证书图片
  legalPersonIdCardImg.value = []; //法人身份证图片
  contractImg.value = []; //法人身份证图片
  bankName.value = null;
  accountNumber.value = null;
  window.location.reload()
};
getData();
/* 删除 */
const del = (id: any) => {
  RequestcompaniesId(id).then((res: any) => {
    getData();
    ElMessage.success(res.msg);
  });
  // console.log(res);
};
/* ******************** 公司审核 *********************/
const auditTableData = ref<any>();
const SubmitReview = (row: any) => {
  row.auditStatus = String(row.auditStatus);
  if (row.auditStatus == "null") {
    row.auditStatus = "审核状态";
  }
  auditTableData.value = row;
  console.log("auditTableData.value", auditTableData.value);
  checkcenterDialogVisible.value = true;
};
const submitAudit = () => {
  // SubmitForm.value = row
  // console.log(row);
  console.log(auditTableData.value.auditStatus);
  if (auditTableData.value.auditStatus == 1) {
    if (auditTableData.value.rejectReason == null) {
      ElMessage.error("请填写拒绝原因");
    } else {
      let cardBank = {
        bankName: bankName.value,
        accountNumber: accountNumber.value,
      };
      RequestCompaniesCompanyActivateAudit({
        id: auditTableData.value.id,
        address: auditTableData.value.address,
        companyName: auditTableData.value.companyName,
        principalName: auditTableData.value.principalName,
        principalPhone: auditTableData.value.principalPhone,
        longitudeAndLatitude: auditTableData.value.longitudeAndLatitude,
        legalPersonId: auditTableData.value.legalPersonId,
        legalPersonName: auditTableData.value.legalPersonName,
        businessLicense: auditTableData.value.businessLicense,
        certification: auditTableData.value.certification,
        phone: auditTableData.value.phone,
        card: JSON.stringify(cardBank),
        auditStatus: auditTableData.value.auditStatus,
        type: auditTableData.value.type,
        rejectReason: auditTableData.value.rejectReason,
      }).then((res: any) => {
        if (res.code == 0) {
          ElMessage.success(res.msg);
          //其它处理代码
          checkcenterDialogVisible.value = false;
          getData();
        } else {
          ElMessage.error(res.msg);
        }
      });
    }
  } else {
    let cardBank = {
      bankName: bankName.value,
      accountNumber: accountNumber.value,
    };
    RequestCompaniesCompanyActivateAudit({
      id: auditTableData.value.id,
      address: auditTableData.value.address,
      companyName: auditTableData.value.companyName,
      principalName: auditTableData.value.principalName,
      principalPhone: auditTableData.value.principalPhone,
      longitudeAndLatitude: auditTableData.value.longitudeAndLatitude,
      legalPersonId: auditTableData.value.legalPersonId,
      legalPersonName: auditTableData.value.legalPersonName,
      businessLicense: auditTableData.value.businessLicense,
      certification: auditTableData.value.certification,
      phone: auditTableData.value.phone,
      card: JSON.stringify(cardBank),
      type: auditTableData.value.type,
      auditStatus: auditTableData.value.auditStatus,
      rejectReason: auditTableData.value.rejectReason,
    }).then((res: any) => {
      if (res.code == 0) {
        ElMessage.success(res.msg);
        //其它处理代码
        checkcenterDialogVisible.value = false;
        getData();
      } else {
        ElMessage.error(res.msg);
      }
    });
  }
};
/* 设置公司权限 */
/* 递归 */
let recursionSectionArr = (arr: any, checkedKeys: any) => {
  arr.forEach((item: any) => {
    if (item.children != null) {
      recursionSectionArr(item.children, checkedKeys);
    } else {
      checkedKeys.push(item.id);
      return item;
    }
  });
};
const displayTreeFlag = ref<any>(false);
const checkedKeys = ref<any>([]);
const mask = async () => {
  let res = await RequestCompaniesGetfunction({
    company: newTableDate.value.node,
  });
  recursionSectionArr(res.resultObj[0].children, checkedKeys.value);
  // treeRefCheck.value.setCheckedKeys(checkedKeys.value)
  // console.log('checkedKeys.value', checkedKeys.value);
  PerCenterDialogVisible.value = true;
  displayTreeFlag.value = true;
};
const closePerCenterDialogVisible = () => {
  checkedKeys.value = [];
  displayTreeFlag.value = false;
  setTimeout(() => {
    window.location.reload();
  }, 200);
  // getData();
  // treeRefCheck.value.setCheckedKeys([]);
};
const treeRefCheck = ref<any>([]);
const saveIdData = ref<any>([]);
const savePermission = () => {
  console.log(treeRefCheck.value);
  console.log(treeRefCheck.value!.getCheckedKeys(false, false));
  console.log("1231", treeRefCheck.value!.getHalfCheckedKeys(false, false));
  treeRefCheck.value!.getHalfCheckedKeys(false, false).forEach((item: any) => {
    saveIdData.value.push({
      sysFunctionId: item,
      dispatchMode: "N",
    });
  });
  treeRefCheck.value!.getCheckedKeys(false, false).forEach((item: any) => {
    saveIdData.value.push({
      sysFunctionId: item,
      dispatchMode: "N",
    });
  });
  saveIdData.value.push({
    sysFunctionId: 0,
    dispatchMode: "N",
  });
  const blob = new Blob(
    [
      JSON.stringify({
        node: editPermission.value.node,
        principalPhone: editPermission.value.principalPhone,
      }),
    ],
    {
      type: "application/json;charset=utf-8",
    }
  );
  const blob2 = new Blob([JSON.stringify(saveIdData.value)], {
    type: "application/json;charset=utf-8",
  });
  const editPermissionF = new FormData();
  editPermissionF.append("company", blob);
  editPermissionF.append("functions", blob2);
  RequestCompaniesSetCompanyFunctions(editPermissionF).then((res: any) => {
    if (res.code == 0) {
      PerCenterDialogVisible.value = false;
      ElMessage.success(res.msg);
      //其它处理代码
      getData();
    } else {
      ElMessage.error(res.msg);
    }
  });
};
// 启用
const startUseBtn = (e: any) => {
  console.log(e);
  const formData = new FormData();
  formData.append("id", e.id);
  // formData.append("functions", blob2);
  RequestCompaniesCompanyRestart(formData).then((res: any) => {
    if (res.success == true) {
      ElMessage.success("启用成功");
      getData();
    }
  });
};

/* ******************** 试用等级 *********************/
const showPopoverData = ref<any>();
const showPopoverFlag = ref(false);
const showPopover = (e: any) => {
  RequestTryLevelGetDetailByLevelName(e).then((res: any) => {
    console.log(res.resultObj);
    if (res.success == true) {
      if (res.resultObj.fittingNumOnSale == undefined || res.resultObj.fittingNumOnSale == null) {
        res.resultObj.fittingNumOnSale = 0
      }
      if (res.resultObj.wholeCarNumOnSale == undefined || res.resultObj.wholeCarNumOnSale == null) {
        res.resultObj.wholeCarNumOnSale = 0
      }
      showPopoverData.value = res.resultObj;
      setTimeout(() => {
        showPopoverFlag.value = true;
      }, 200);
    }
  });
};
/* ******************** 试用历史记录 *********************/
const trialHistoryDialogVisible = ref<any>(false);
const trialHistoryTableData = ref<any>([]);
const trialHistoryBtn = (e: any) => {
  RequestTryCompanyGetHistory(e.node).then((res: any) => {
    if (res.success == true) {
      console.log(res.resultObj);
      trialHistoryTableData.value = res.resultObj;
      trialHistoryDialogVisible.value = true;
    }
  });
};
/* ******************** 修改公司等级 *********************/
const disableDate = (time: any) => {
  return time.getTime() < Date.now() - 8.64e7;
};
const defaultTime = (H: any, M: any, S: any) => {
  var now = new Date();
  now.setHours(H);
  now.setMinutes(M);
  now.setSeconds(S);
  return now;
};
const editHistoryDialogVisible = ref<any>(false);
const editHistoryTableData = ref<any>({
  companyNode: null,
  validity: null,
  levelId: null,
});
const tryLevelList = ref<any>([]);
const editHistoryBtn = (e) => {
  console.log(e.node);
  editHistoryTableData.value.companyNode = e.node;
  RequestTryLevelList().then((res: any) => {
    console.log(res.resultObj);
    tryLevelList.value = res.resultObj;
  });
  editHistoryDialogVisible.value = true;
};
const editHistorySaveBtn = () => {
  console.log(editHistoryTableData.value);
  RequestTryCompanyResetTryCompanyValidity(editHistoryTableData.value).then(
    (res: any) => {
      if (res.success == true) {
        getData();
        editHistoryDialogVisible.value = false;
        ElMessage.success(res.msg);
      }
    }
  );
};
</script>

<style scoped lang="scss">
/* 弹出框样式 */
::v-deep .el-dialog__header {
  background-color: #116cf8;
  margin-right: 0;

  .el-icon svg {
    color: #dcdfe6;
  }
}

::v-deep .el-dialog__title {
  color: #fff;
}

.main {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  .main_nav {
    background-color: #fff;
  }

  .main_content {
    background-color: #fff;
  }
}

.el-descriptions {
  margin-top: 1.25rem;
}

.cell-item {
  display: flex;
  align-items: center;
}

.margintop {
  margin-top: 1.25rem;
}

.avatar-uploader .el-upload {
  border: 0.0625rem dashed var(--el-border-color);
  border-radius: 0.375rem;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  transition: var(--el-transition-duration-fast);
}

.avatar-uploader .el-upload:hover {
  border-color: var(--el-color-primary);
}

.el-icon.avatar-uploader-icon {
  font-size: 1.75rem;
  color: #8c939d;
  width: 5.625rem;
  height: 5.625rem;
  border: 0.0625rem solid #ccc;
  text-align: center;
  border-radius: 0.5rem;
}

// .bor {
//     :deep(.el-input__wrapper) {
//         box-shadow: 0 0 0 0rem var(--el-input-border-color, var(--el-border-color)) inset;
//         cursor: default;

//         .el-input__inner {
//             cursor: default !important;
//         }
//     }
// }

.custom-tree-node {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.875rem;
  padding-right: 0.5rem;
}

::v-deep .el-upload--picture-card {
  --el-upload-picture-card-size: 3.75rem;
}

::v-deep .el-upload {
  .el-icon svg {
    color: #dcdfe6;
  }
}

::v-deep .el-upload-list--picture-card .el-upload-list__item-thumbnail {
  width: 3.75rem;
  height: 3.75rem;
  -o-object-fit: contain;
  object-fit: contain;
}

::v-deep .el-upload-list--picture-card .el-upload-list__item {
  width: 3.75rem;
  height: 3.75rem;
}

::v-deep .el-upload-list--picture-card .el-upload-list__item-actions {
  width: 3.75rem;
  height: 3.75rem;
}
</style>
